<html>
	<head>
		<title>Performance</title>
		<script type="text/javascript" src="https://www.google.com/jsapi"></script>
		<script type="text/javascript">
			google.load("visualization", "1", {packages:["corechart"]});
			google.setOnLoadCallback(drawChart);

			function drawChart() {
				var data = new google.visualization.DataTable();

				data.addColumn('number', 'CacheHits');
				data.addColumn('number', 'Latency');

				<?php
					include_once('config.inc.php');
					include_once('functions.inc.php');

					connectToDatabase();

					$resource = mysql_query("SELECT * FROM metrics;");
	
					while ($row = mysql_fetch_array($resource))
						echo "\t\t\t\tdata.addRow([" . $row['cache_hits'] . ", " . $row['latency'] . "]);\n";
				?>

				var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
				chart.draw(data, {width: 800, height: 600,
								  title: 'Performance Tracking',
								  hAxis: {title: 'Cache Hits', minValue: 0,maxValue: 15},
								  vAxis: {title: 'Latency', minValue: 0, maxValue: 20000},
								  legend: 'none'});
			}
		</script>
	</head>
	<body>
		<div id="chart_div"></div>
	</body>
</html>
